<template>
    <el-container class="big_container">
<!--        头部导航栏-->
        <home-header/>
        <el-container class="wrap_container">
<!--            侧边导航栏-->
            <home-side :message="menuList"/>
<!--            主体内容-->
            <home-main/>
        </el-container>
    </el-container>
</template>

<script>
    import HomeHeader from "./childComp/HomeHeader";
    import HomeSide from "./childComp/HomeSide";
    import HomeMain from "./childComp/HomeMain";
    import {getMenu} from "../../network/menu";

    export default {
        name: "Home",
        data(){
            return{
                menuList:[]
            }
        },
        components:{
            HomeHeader,
            HomeSide,
            HomeMain
        },
        mounted() {
            this.getMenuM()
        },
        methods:{
            //获取菜单栏数据
            getMenuM(){
                getMenu().then(res => {
                    // console.log(res.data.data);
                    this.menuList = res.data.data;
                })
            }
        }
    }
</script>

<style scoped lang="less">
    .big_container{
        background-color: #f1f2f6;
        display: flex;
        position: relative;
    }
    .wrap_container{
        display: flex;
        position: absolute;
        top: 60px;
        width: 100%;
        height: calc(100vh - 60px);
    }

</style>